import React, {Component} from 'react';
import {observer, inject} from 'mobx-react';
import {withRouter} from 'react-router';
import {Menu, Icon} from 'antd';
import { SSL_OP_NETSCAPE_REUSE_CIPHER_CHANGE_BUG } from 'constants';

@withRouter
@inject('home')
@inject('login')
@observer
export default class Head extends Component {
  logout = () => {
    // console.log(this.props);
    this.props.login.logout();
    this.props.history.push('/login');
  }

  onSelect = (key) => {
    // console.log(key, 333);
  }

  render() {
    return(
      <Menu className="menu" mode="horizontal" selectedKeys={[]} onSelect={this.onSelect}>
        <Menu.Item>
          <Icon type="message"/><span>消息</span>
        </Menu.Item>
        <Menu.Item>
          <Icon type="database"/><span>文档</span>
        </Menu.Item>
        <Menu.Item>
          <Icon type="tool"/><span>帮助</span>
        </Menu.Item>
        <Menu.SubMenu title={<span><Icon type="user"/>用户</span>}>
          <Menu.Item>
            <Icon type="profile" /><span>用户详情</span>
          </Menu.Item>
          <Menu.Item key={'/logout'}>
            <p onClick={this.logout} >
              <Icon type="logout" /><span>退出登录</span>
            </p>
          </Menu.Item>
        </Menu.SubMenu>
      </Menu>
    );
  }
}